<template>
    <div class="user-info">
        <el-card>
            <div slot="header">
                <div class="user-img">
                    <img :src="user.imgUrl"/>
                </div>

            </div>
            <div>
                <div style="display: flex;justify-content: space-around">
                    <span>姓名 ： {{user.zhName}}</span>
                    <el-button type="primary" size="mini">修改密码</el-button>
                </div>
            </div>
        </el-card>
    </div>
</template>

<script>
    export default {
        name: "userInfo",
        data(){
            return{
                user : JSON.parse(window.sessionStorage.getItem("user")),
            }
        }
    }
</script>

<style>
    .user-info .el-card{
        width: 500px;
        margin: 20px auto;
    }
    .user-info .user-img{
        margin: auto;
        border: 1px solid darkblue;
        border-radius: 40px;
        width: 80px;
        height: 80px;
    }
    .user-info .user-img img{
        border-radius: 40px;
        width: 100%;
    }
</style>